<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>index</title>
</head>
<body>
<h1>UpdateTest page</h1>

<input type="text" id="u1">×
<input type="text" id="u2">=
<input type="text" id="u3">
<button type="submit" id="b1">calc</button>
<br>
<input type="text" id="v1">+
<input type="text" id="v2">=
<input type="text" id="v3">
<button id="bb">calc</button>
<br>

<label for="f1">选择上传文件</label>
<input type="file" id="f1">
<button id="ud">确认上传</button>
<br>

</body>
<script src="/static/js/jquery-3.4.1.min.js"></script>
<script src="/static/js/ajax_setup.js"></script>
<script>
    $("#b1").click(function () {
        var u1=$("#u1").val()
        var u2=$("#u2").val()
        $.ajax({
            url:"/calcc/",
            method:"post",
            data:{"u1":u1,"u2":u2},
            success:function (ret) {
              $("#u3").val(ret)
            }
        })
    });

    $("#bb").click(
        function () {
            $.ajax({
                type: "get",
                url: "/calc/",
                data: {"v1":$("#v1").val(), "v2":$("#v2").val()},
                success:function (data) {
                    $("#v3").val(data)
                }
            })
        }
    )
    $("#ud").click(function () {
        var formdata = new FormData();
        formdata.append('f1', $('#f1')[0].files[0]);
        $.ajax({
            url: '/upload/',
            type: 'post',
            data: formdata,
            processData: false,
            contentType: false,
            success: function (data) {
                alert(data)
            }
        })
    })
</script>
</html>